import 'package:flutter/material.dart';

class ObliqueList extends StatefulWidget {
  @override
  _ObliqueListState createState() => _ObliqueListState();
}

class _ObliqueListState extends State<ObliqueList>
    with SingleTickerProviderStateMixin {
  AnimationController _controller;

  @override
  void initState() {
    super.initState();
    _controller = AnimationController(vsync: this);
  }

  @override
  void dispose() {
    super.dispose();
    _controller.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('倾斜的列表')),
      body: diagonal(children: [
        Text('🐂'),
        Text('🐂'),
        Text('年'),
        Container(
          height: 30,
          width: 30,
          color: Colors.yellow,
        ),
        Text('大'),
        Text('吉'),
        Text('❄️'),
        Text('❄️')
      ]),
    );
  }

  Widget diagonal({List<Widget> children}) {
    return Column(
      children: [
        for (int i = 0; i < children.length; i++)
          Row(
            children: children.sublist(0, i + 1).asMap().keys.map((e) {
              print(e);
              return Offstage(
                offstage: children[e] is Icon && i != e,
                child: SizedBox(
                  height: e != i ? 0 : null,
                  child: children[e],
                ),
              );
            }).toList(),
          )
      ],
    );
  }
}
